//@flow

/**
 * 自动带有提取首字母
 * 自动分组
 * 吸顶功能
 */
import React, { Component } from 'react';
import { 
    View,
    TouchableHighlight,
    Text,
    Image,
    SectionList,
 } from 'react-native';
import { Navigate } from '../../common/navigate';


export type ItemProps = {
    title                   :string,//用于提取首字母的文本内容，** 必须参数 **
    data	                :Array<T>,//其他可扩张内容   
}
export type Props = {
    data                    :Array<ItemProps>,
    layout                  :(data:ItemProps,index:number,list:Array<ItemProps>)=>{}
}
const Data :Array<ItemProps> = [
    {
        title:'A',
        data:["hello","world","nihao"]
    },
    {
        title:'c',
        data:["hello","world","nihao"]
    },
    {
        title:'b',
        data:["hello","world","nihao"]
    },
    {
        title:'d',
        data:["hello","world","nihao"]
    },
    {
        title:'e',
        data:["hello","world","nihao"]
    },
]
export class IndexList extends Component <Props,{}>{
    /**初始化props */
    static defaultProps : Props = {
        data : [],
    }
    render(){
        return(
            <SectionList
                sections={this.props.data}
                renderItem={({item,index,section})=>{
                    return <Text onPress={()=>{Navigate.navigate('ReqAnalyzer')}} key={index}>{item.label}+{item.value}</Text>
                }}
                keyExtractor={(item, index) =>  index}
                renderSectionHeader={({section:{title}})=>{
                    return <Text style={{backgroundColor: 'rgb(220,220,220)',}}>{title}</Text>
                }}/>
        )
    }
}